<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>后台</title>
	 <link rel="stylesheet" type="text/css" href="/css/css.css">
	 <link rel="stylesheet" type="text/css" href="/font-awesome-4.7.0/css/font-awesome.min.css">
	 <link  rel="stylesheet" type="text/css" href="/css/lyz.calendar.css" />
     <script src='/js/vue/vue.js'></script>
     <script src='/js/jquery.js'></script>
     <script src='/js/layer.js'></script>
</head>

<body>
	{include file='index/public/header'}
<div class="left">
{include file='index/public/left'}
</div>
<div id="right">
	<a href="javascript:;" id="fabu" @click='fl_add()'><font style='font-weight:bold;font-size:18px;position:relative;top:2px;'>+</font> 添加分类</a>
<table width="84.8%" border="0" cellspacing="0" cellpadding="0" class="list" >
		<tr style='background:#cae4ff;height:30px;'>
			<th class="bgtt" width="20"><input type="checkbox" name="checkall" onclick="pe_checkall(this, 'category_id')" style='margin-left:-8px;'/></th>
			<th class="bgtt" width="40">ID号</th>
			<th class="bgtt" width="40">排序</th>
			<th class="bgtt">分类名称</th>
			<th class="bgtt" width="110">操作</th>
		</tr>
		</table>
{volist name="list" id="vo" }
     <p ><input type='checkbox' value='{$vo.id}'/><font style='margin-left:6px;'>{$vo.id}</font><input type='text' value='{$vo.fl_num}' class='num'/>{$vo.fl_name}</font><span class='save'><a href='javascript:;' class='admin_edit' @click='fl_edit({$vo.id})'>修改</a> <a href='javascript:;'  class='admin_del' @click='fl_delt({$vo.id})'>删除</a></span></p>
{/volist}
</div>
</body>
</html>
<script>
   new Vue({
     el:"#right",
     data:{
     
     },methods:{
     	//添加
     	fl_add(){
             layer.open({
               type: 2,
               title: '添加分类页',
               shadeClose: true,
               shade: 0.1,
               area: ['500px', '40%'],
               content: '/admin.php/home/fl_add' //iframe的url
             }); 
     	},
     	//修改
         fl_edit(id){
           layer.open({
               type: 2,
               title: '修改分类页',
               shadeClose: true,
               shade: 0.1,
               area: ['500px', '40%'],
               content: '/admin.php/home/fl_add?id='+id //iframe的url
             }); 
         }
     	,
     	//删除
     	fl_delt(id){
                layer.confirm('确定删除ID号为‘'+id+'’的分类?', {
                      btn: ['确定','取消'] //按钮
                   }, function(){
                   	layer.msg('正在删除...', {time: 20000,icon:16});
                       $.ajax({
                           url:'/admin.php/home/fl_delt',
                           data:{id:id},
                           dataType:'json',
                           type:'post',
                           success:function(res){
                              if(res.status=='ok'){
                              	   layer.msg('删除成功！', {time: 1500,icon:1});
                              }else{
                              	  layer.msg('删除失败！', {time: 1500,icon:7});
                              }
                             setTimeout(function(){
                             	 if(res.status=='ok'){
                             	 	 window.location.reload();
                             	 }
                             	 larey.closeAll();
                             },1600);

                           }
                       }); 
                    }, function(){
                       layer.closeAll();
              });
     	}
     }
   });
</script>
<style>
  tr{
    border-bottom:1px solid #ccc;
    }
    .right_main  table tr:hover{
       cursor:pointer;
       background:#efefef;
    }
    .inputtext{
       width:30px;
       height:20px;
    }
.save{
  float:right;
}
   .num{
       width:25px;
       height:20px;
       text-align:center;
       line-height:25px;
       margin-left:25px;
       margin-top:3px;
   }

    .admin_edit,.admin_del{border-radius:3px;position:relative;top:7px;}
    .admin_edit{
        border:1px solid green;
	color:green;
    }
    .admin_del{
       border:1px solid orange;
	color:orange;
    }
     #fabu{
      background: #09C878;
    padding: 0 10px 0 10px;
    color: #fff;
    float: right;
    margin: 8px 0px 10px 0;
    height: 26px;
    min-width: 26px;
    _width: 10px;
    line-height: 25px;
    border: 1px solid #00c874;
    border-radius: 18px;
    font-size: 12px
    }
</style>
